<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>table</title>
		<style >
			th{
				border: 1px #1E90FF solid;
			}
			td{
				border: 1px  #1E90FF solid;
			}
			.del{
				color: blue;
				cursor: pointer;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<button onclick="addText()">
			添加文本
		</button>
		<div id="text">
			
		</div>
		<table style="border: 1PX #1E90FF solid;">
			<header>
				<th width="200PX">
					姓名
				</th>
				<th>
					学号
				</th>
				<th>
					班级
				</th>
				<th width="300PX">
					班级
				</th>
				<th width="150px">
					操作栏
				</th>
				
			</header>
				<tr id="tr1">
				<td width="100px"> 张三</td>
				<td>001</td>
				<td>计算机</td>
				<td class="del" onclick="del(this)">删除</td>
				</tr>
				<tr id="tr2">
				<td>李四</td>
				<td>002</td>
				<td>计算机</td>
				<td class="del" onclick="del(this)">删除</td>
			    </tr>
		</table>
	</body>
	<script type="text/javascript">
		//创建一个文本节点 createTextNode
		//创建一个标签节点
		function addText
		{
			//let oTextWrapper =document.createTextNode('我是被创建的文本节点')		
			let oTextWrapper =document.getElementById('Text')
			let oP=document.createElement('p')
			oP.innerText='我是被创建的p节点'
			oTextWrapper.appendChild(oP)		
		}
		function del(e){
			//e.remove()
			//let tr=document.getElementById(e)
			//tr.remove()
			obj.remove();移除自己
			obj.removeChild(childNode);移除字节点的某个节点
			console.dir(e.parentNode.parentNode)
			e.parentNode.parentNode.removeChild(e.parentNode)
		}
	</script>
</html>
